<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
    <!-- 引入样式 -->
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <!-- 引入组件库 -->
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
</head>
<!--<style>-->
<!--fieldset{-->
<!--width: 800px;-->
<!--margin: 0 auto;-->
<!--margin-top: 50px;-->
<!--}-->
<!--</style>-->
<body>
<div id="app">
    <!-- 步骤条 -->
    <el-steps :active="1" align-center>
        <el-step title="步骤一" description="选择要预约的医生和科室"></el-step>
        <el-step title="步骤2" description=""></el-step>
        <el-step title="步骤3" description=""></el-step>
    </el-steps>


    <!-- 选择框 -->
    <el-collapse v-model="activeNames" @change="handleChange">


        <el-collapse-item title="内科" name="1">
            <el-button type="danger" v-for="(k,i) in Department" @click="chaxun(k.id)">{{k.kname}}</el-button>
        </el-collapse-item>

        <el-collapse-item title="外科" name="2">
            <el-button type="success" v-for="(s,i) in Surgery" @click="query(s.id)">{{s.kname}}</el-button>
        </el-collapse-item>

        <el-collapse-item title="骨科" name="3">
            <el-button type="warning" v-for="(g,i) in Guke" @click="list(g.id)">{{g.kname}}</el-button>
        </el-collapse-item>

        <el-collapse-item title="心理科" name="4">
            <el-button type="success" v-for="(x,i) in Xinlike" @click="all(x.id)">{{x.kname}}</el-button>
        </el-collapse-item>

    </el-collapse>


</div>
<script>

    $.get("/ssm/register/getks",function (backData) {
        haha.Department = backData.data;
    });
    $.get("/ssm/register/waike",function (backData) {
        haha.Surgery = backData.data;
    });
    $.get("/ssm/register/guke",function (backData) {
        haha.Guke = backData.data;
    });
    $.get("/ssm/register/xinlike",function (backData) {
        haha.Xinlike = backData.data;
    });

    var haha = new Vue({
        el:"#app",
        data:{
            activeNames:{},
            Department:[],
            Surgery:[],
            Guke:[],
            Xinlike:[]
        },
        methods:{
            chaxun(id){
                window.location.href = "/ssm/yuyue/huxidao.html?id="+id;
            },
            query(id){
                window.location.href = "/ssm/yuyue/surgery.html?id="+id;
            },
            list(id){
                window.location.href = "/ssm/yuyue/bone.html?id="+id;
            },
            all(id){
                window.location.href = "/ssm/yuyue/heart.html?id="+id;
            },
            handleChange(val) {
                console.log(val);
            }
        }
    });
</script>
</body>
</html>